// 地图仓库
import AMapLoader from '@amap/amap-jsapi-loader'
import { App, reactive, getCurrentInstance } from 'vue'
import { AMapConfig } from '@/constants/index'
import { defineStore } from 'pinia'


let useGMapManage = defineStore('Gmap', {
  state: () => {
    return {
      state: reactive({
        overlayGroupPic:null as any,
        overlayGroupLable:null as any,
        aMap: null, // Map类
        map: null, // 地图对象
        mouseTool: null,
        coverList:null,
        markerInfo:[] as any
      })
    }
  },
  actions: {
    async initMap(container: any) {
      await AMapLoader.load({
        ...AMapConfig
      }).then((AMap) => {
        
        this.state.aMap = AMap
        this.state.map = new AMap.Map(container, {
          viewMode: '2D', //地图模式
          // terrain: true, //开启地形图
          center: [113.943225499, 22.577673716],
          zoom: 15
        })

        this.state.mouseTool = new AMap.MouseTool(this.state.map)
        // 挂在到全局
        AMap.plugin(["AMap.ToolBar", "AMap.Scale", "AMap.ControlBar", "AMap.HawkEye", "AMap.Geolocation", "AMap.MapType", "AMap.MouseTool"], ()=> {
          //异步同时加载多个插件
          // 添加地图插件
          this.state.map.addControl(new AMap.ToolBar()); // 工具条控件;范围选择控件
          this.state.map.addControl(new AMap.Scale()); // 显示当前地图中心的比例尺
          this.state.map.addControl(new AMap.HawkEye()); // 显示缩略图
          this.state.map.addControl(new AMap.Geolocation()); // 定位当前位置
          this.state.map.addControl(new AMap.MapType()); // 实现默认图层与卫星图,实时交通图层之间切换
          this.state.map.addControl(new AMap.ControlBar()); // 实现默认图层与卫星图,实时交通图层之间切换
          AMap.ControlBar({ //控制地图旋转插件
            position: {
                right: '10px',
                top: '10px'
            }
        });


        })
      }).catch(e => {
        console.log(e)
      })
    }
  }
})
export default useGMapManage;

